<template>
    <div class="app-container">
        <a-card>
            <BasicTable ref="tableRef" :params="params" :columns="columns" :selectbox="false" :query="query">
                <template #form>
                    <a-form-item label="标题" name="title">
                        <a-input v-model:value="params.title" placeholder="请输入标题" />
                    </a-form-item>
                </template>
                <template #button>
                    <a-button v-permission="'system:notice:add'" type="primary" @click="open(modalRef)">
                        <template #icon>
                            <PlusOutlined />
                        </template>
                        新增
                    </a-button>
                </template>
                <template #table="{ body }">
                    <template v-if="body.column.key === 'type'">
                        <dict-text :value="body.record.type" dict-code="noticeType" />
                    </template>
                    <template v-if="body.column.key === 'priority'">
                        <dict-text v-model:value="body.record.priority" dict-code="priority" />
                    </template>
                    <template v-if="body.column.key === 'status'">
                        {{ body.record.status === 0 ? '已发布' : '已撤销' }}
                    </template>
                    <template v-if="body.column.key === 'createDate'">
                        {{ parseTime(body.record.createDate) }}
                    </template>
                    <template v-if="body.column.key === 'revocationDate'">
                        {{ body.record.revocationDate ? body.record.revocationDate : '--' }}
                    </template>
                    <template v-if="body.column.key === 'action'">
                        <a-popconfirm v-if="body.record.status === 0" title="此操作不能恢复，确定要撤销通告吗？" @confirm="handleOnRevocation(body.record)">
                            <a-button v-permission="'system:notice:revoke'" type="link">
                                <template #icon>
                                    <ExportOutlined />
                                </template>
                                撤销
                            </a-button>
                        </a-popconfirm>
                        <a-popconfirm title="确定要删除吗?" @confirm="del(deleteById, body.record.id, tableRef)">
                            <a-button v-permission="'system:notice:delete'" type="link">
                                <template #icon>
                                    <DeleteOutlined />
                                </template>
                                删除
                            </a-button>
                        </a-popconfirm>
                    </template>
                </template>
            </BasicTable>
        </a-card>
        <Drawer ref="modalRef" @close="refresh(tableRef)" />
    </div>
</template>
<script setup name="NoticeModule">
import { reactive, ref } from 'vue'
import Drawer from './Drawer.vue'
import { PlusOutlined, DeleteOutlined, ExportOutlined } from '@ant-design/icons-vue'
import { query, deleteById, updateStatus } from '/@/api/System/Notice'
import { useBasicTable } from '@iframe/tools/mixins/BasicTableMixins'
import { DictText, notice, BasicTable } from '@iframe/tools/components'
import { SUCCESS_CODE } from '@iframe/tools/axios/axios'

const { refresh, del, open } = useBasicTable()
const tableRef = ref()
const modalRef = ref()
const params = reactive({})
const columns = [
    {
        title: '标题',
        dataIndex: 'title',
        key: 'title'
    },
    {
        title: '消息类型',
        dataIndex: 'type',
        key: 'type'
    },
    {
        title: '发布人',
        dataIndex: 'creatorName',
        key: 'creatorName'
    },
    {
        title: '优先级',
        dataIndex: 'priority',
        key: 'priority'
    },
    {
        title: '发布状态',
        dataIndex: 'status',
        key: 'status',
        width: 130,
        align: 'center'
    },
    {
        title: '发布时间',
        dataIndex: 'createDate',
        key: 'createDate',
        align: 'center',
        width: 200
    },
    {
        title: '撤销时间',
        dataIndex: 'revocationDate',
        key: 'revocationDate',
        align: 'center',
        width: 200
    },
    {
        title: '操作',
        key: 'action',
        align: 'center',
        width: 260
    }
]
const handleOnRevocation = row => {
    updateStatus({ id: row.id }).then(result => {
        if (result.code === SUCCESS_CODE) {
            notice.success('撤销成功')
            tableRef.value.handleRefresh()
        }
    })
}
</script>
